define(function(require, exports, module) {

	/* =========================================================
	 * bootstrap-colorpicker.js
	 * http://www.eyecon.ro/bootstrap-colorpicker
	 * =========================================================
	 * Copyright 2012 Stefan Petre
	 *
	 * Licensed under the Apache License, Version 2.0 (the "License");
	 * you may not use this file except in compliance with the License.
	 * You may obtain a copy of the License at
	 *
	 * http://www.apache.org/licenses/LICENSE-2.0
	 *
	 * Unless required by applicable law or agreed to in writing, software
	 * distributed under the License is distributed on an "AS IS" BASIS,
	 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
	 * See the License for the specific language governing permissions and
	 * limitations under the License.
	 * ========================================================= */

	! function($) {

		// Color object

		var Color = function(val) {
			this.value = {
				h: 1,
				s: 1,
				b: 1,
				a: 1
			};
			this.setColor(val);
		};

		Color.prototype = {
			constructor: Color,

			//parse a string to HSB
			setColor: function(val) {
				val = val.toLowerCase();
				var that = this;
				$.each(CPGlobal.stringParsers, function(i, parser) {
					var match = parser.re.exec(val),
						values = match && parser.parse(match),
						space = parser.space || 'rgba';
					if (values) {
						if (space === 'hsla') {
							that.value = CPGlobal.RGBtoHSB.apply(null, CPGlobal.HSLtoRGB.apply(null, values));
						} else {
							that.value = CPGlobal.RGBtoHSB.apply(null, values);
						}
						return false;
					}
				});
			},

			setHue: function(h) {
				this.value.h = 1 - h;
			},

			setSaturation: function(s) {
				this.value.s = s;
			},

			setLightness: function(b) {
				this.value.b = 1 - b;
			},

			setAlpha: function(a) {
				this.value.a = parseInt((1 - a) * 100, 10) / 100;
			},

			// HSBtoRGB from RaphaelJS
			// https://github.com/DmitryBaranovskiy/raphael/
			toRGB: function(h, s, b, a) {
				if (!h) {
					h = this.value.h;
					s = this.value.s;
					b = this.value.b;
				}
				h *= 360;
				var R, G, B, X, C;
				h = (h % 360) / 60;
				C = b * s;
				X = C * (1 - Math.abs(h % 2 - 1));
				R = G = B = b - C;

				h = ~~h;
				R += [C, X, 0, 0, X, C][h];
				G += [X, C, C, X, 0, 0][h];
				B += [0, 0, X, C, C, X][h];
				return {
					r: Math.round(R * 255),
					g: Math.round(G * 255),
					b: Math.round(B * 255),
					a: a || this.value.a
				};
			},

			toHex: function(h, s, b, a) {
				var rgb = this.toRGB(h, s, b, a);
				return '#' + ((1 << 24) | (parseInt(rgb.r) << 16) | (parseInt(rgb.g) << 8) | parseInt(rgb.b)).toString(16).substr(1);
			},

			toHSL: function(h, s, b, a) {
				if (!h) {
					h = this.value.h;
					s = this.value.s;
					b = this.value.b;
				}
				var H = h,
					L = (2 - s) * b,
					S = s * b;
				if (L > 0 && L <= 1) {
					S /= L;
				} else {
					S /= 2 - L;
				}
				L /= 2;
				if (S > 1) {
					S = 1;
				}
				return {
					h: H,
					s: S,
					l: L,
					a: a || this.value.a
				};
			}
		};

		// Picker object

		var Colorpicker = function(element, options) {
			this.element = $(element);
			var format = options.format || this.element.data('color-format') || 'hex';
			this.format = CPGlobal.translateFormats[format];
			this.isInput = this.element.is('input');
			this.component = this.element.is('.color') ? this.element.find('.input-group-btn') : false; // modified by keenthemes for Bootstrap 3.0 support

			this.picker = $(CPGlobal.template)
				.appendTo('body')
				.on('mousedown', $.proxy(this.mousedown, this));

			if (this.isInput) {
				this.element.on({
					'focus': $.proxy(this.show, this),
					'keyup': $.proxy(this.update, this)
				});
			} else if (this.component) {
				this.component.on({
					'click': $.proxy(this.show, this)
				});
			} else {
				this.element.on({
					'click': $.proxy(this.show, this)
				});
			}
			if (format === 'rgba' || format === 'hsla') {
				this.picker.addClass('alpha');
				this.alpha = this.picker.find('.colorpicker-alpha')[0].style;
			}

			if (this.component) {
				this.picker.find('.colorpicker-color').hide();
				this.preview = this.element.find('i')[0].style;
			} else {
				this.preview = this.picker.find('div:last')[0].style;
			}

			this.base = this.picker.find('div:first')[0].style;
			this.update();
		};

		Colorpicker.prototype = {
			constructor: Colorpicker,

			show: function(e) {
				this.picker.show();
				this.height = this.component ? this.component.outerHeight() : this.element.outerHeight();
				this.place();
				$(window).on('resize', $.proxy(this.place, this));
				if (!this.isInput) {
					if (e) {
						e.stopPropagation();
						e.preventDefault();
					}
				}
				$(document).on({
					'mousedown': $.proxy(this.hide, this)
				});
				this.element.trigger({
					type: 'show',
					color: this.color
				});
			},

			update: function() {
				this.color = new Color(this.isInput ? this.element.prop('value') : this.element.data('color'));
				this.picker.find('i')
					.eq(0).css({
						left: this.color.value.s * 100,
						top: 100 - this.color.value.b * 100
					}).end()
					.eq(1).css('top', 100 * (1 - this.color.value.h)).end()
					.eq(2).css('top', 100 * (1 - this.color.value.a));
				this.previewColor();
			},

			setValue: function(newColor) {
				this.color = new Color(newColor);
				this.picker.find('i')
					.eq(0).css({
						left: this.color.value.s * 100,
						top: 100 - this.color.value.b * 100
					}).end()
					.eq(1).css('top', 100 * (1 - this.color.value.h)).end()
					.eq(2).css('top', 100 * (1 - this.color.value.a));
				this.previewColor();
				this.element.trigger({
					type: 'changeColor',
					color: this.color
				});

				console.log(this.color);
			},

			hide: function() {
				this.picker.hide();
				$(window).off('resize', this.place);
				if (!this.isInput) {
					$(document).off({
						'mousedown': this.hide
					});
					if (this.component) {
						this.element.find('input').prop('value', this.format.call(this));
					}
					this.element.data('color', this.format.call(this));
				} else {
					this.element.prop('value', this.format.call(this));
				}
				this.element.trigger({
					type: 'hide',
					color: this.color
				});
			},

			place: function() {
				var offset = this.component ? this.component.offset() : this.element.offset();
				this.picker.css({
					top: offset.top + this.height,
					left: offset.left
				});
			},

			//preview color change
			previewColor: function() {
				try {
					this.preview.backgroundColor = this.format.call(this);
				} catch (e) {
					this.preview.backgroundColor = this.color.toHex();
				}
				//set the color for brightness/saturation slider
				this.base.backgroundColor = this.color.toHex(this.color.value.h, 1, 1, 1);
				//set te color for alpha slider
				if (this.alpha) {
					this.alpha.backgroundColor = this.color.toHex();
				}
			},

			pointer: null,

			slider: null,

			mousedown: function(e) {
				e.stopPropagation();
				e.preventDefault();

				var target = $(e.target);

				//detect the slider and set the limits and callbacks
				var zone = target.closest('div');
				if (!zone.is('.colorpicker')) {
					if (zone.is('.colorpicker-saturation')) {
						this.slider = $.extend({}, CPGlobal.sliders.saturation);
					} else if (zone.is('.colorpicker-hue')) {
						this.slider = $.extend({}, CPGlobal.sliders.hue);
					} else if (zone.is('.colorpicker-alpha')) {
						this.slider = $.extend({}, CPGlobal.sliders.alpha);
					} else {
						return false;
					}
					var offset = zone.offset();
					//reference to knob's style
					this.slider.knob = zone.find('i')[0].style;
					this.slider.left = e.pageX - offset.left;
					this.slider.top = e.pageY - offset.top;
					this.pointer = {
						left: e.pageX,
						top: e.pageY
					};
					//trigger mousemove to move the knob to the current position
					$(document).on({
						mousemove: $.proxy(this.mousemove, this),
						mouseup: $.proxy(this.mouseup, this)
					}).trigger('mousemove');
				}
				return false;
			},

			mousemove: function(e) {
				e.stopPropagation();
				e.preventDefault();
				var left = Math.max(
					0,
					Math.min(
						this.slider.maxLeft,
						this.slider.left + ((e.pageX || this.pointer.left) - this.pointer.left)
					)
				);
				var top = Math.max(
					0,
					Math.min(
						this.slider.maxTop,
						this.slider.top + ((e.pageY || this.pointer.top) - this.pointer.top)
					)
				);
				this.slider.knob.left = left + 'px';
				this.slider.knob.top = top + 'px';
				if (this.slider.callLeft) {
					this.color[this.slider.callLeft].call(this.color, left / 100);
				}
				if (this.slider.callTop) {
					this.color[this.slider.callTop].call(this.color, top / 100);
				}
				this.previewColor();
				this.element.trigger({
					type: 'changeColor',
					color: this.color
				});
				/**
				 * update :simon
				 * mousemove 的时候同时改变文本框里面的值
				 */
				if (this.component) {
					this.element.find('input').prop('value', this.format.call(this));
				}
				return false;
			},

			mouseup: function(e) {
				e.stopPropagation();
				e.preventDefault();
				$(document).off({
					mousemove: this.mousemove,
					mouseup: this.mouseup
				});
				return false;
			}
		}

		$.fn.colorpicker = function(option, val) {
			return this.each(function() {
				var $this = $(this),
					data = $this.data('colorpicker'),
					options = typeof option === 'object' && option;
				if (!data) {
					$this.data('colorpicker', (data = new Colorpicker(this, $.extend({}, $.fn.colorpicker.defaults, options))));
				}
				if (typeof option === 'string') data[option](val);
			});
		};

		$.fn.colorpicker.defaults = {};

		$.fn.colorpicker.Constructor = Colorpicker;

		var CPGlobal = {

			// translate a format from Color object to a string
			translateFormats: {
				'rgb': function() {
					var rgb = this.color.toRGB();
					return 'rgb(' + rgb.r + ',' + rgb.g + ',' + rgb.b + ')';
				},

				'rgba': function() {
					var rgb = this.color.toRGB();
					return 'rgba(' + rgb.r + ',' + rgb.g + ',' + rgb.b + ',' + rgb.a + ')';
				},

				'hsl': function() {
					var hsl = this.color.toHSL();
					return 'hsl(' + Math.round(hsl.h * 360) + ',' + Math.round(hsl.s * 100) + '%,' + Math.round(hsl.l * 100) + '%)';
				},

				'hsla': function() {
					var hsl = this.color.toHSL();
					return 'hsla(' + Math.round(hsl.h * 360) + ',' + Math.round(hsl.s * 100) + '%,' + Math.round(hsl.l * 100) + '%,' + hsl.a + ')';
				},

				'hex': function() {
					return this.color.toHex();
				}
			},

			sliders: {
				saturation: {
					maxLeft: 100,
					maxTop: 100,
					callLeft: 'setSaturation',
					callTop: 'setLightness'
				},

				hue: {
					maxLeft: 0,
					maxTop: 100,
					callLeft: false,
					callTop: 'setHue'
				},

				alpha: {
					maxLeft: 0,
					maxTop: 100,
					callLeft: false,
					callTop: 'setAlpha'
				}
			},

			// HSBtoRGB from RaphaelJS
			// https://github.com/DmitryBaranovskiy/raphael/
			RGBtoHSB: function(r, g, b, a) {
				r /= 255;
				g /= 255;
				b /= 255;

				var H, S, V, C;
				V = Math.max(r, g, b);
				C = V - Math.min(r, g, b);
				H = (C === 0 ? null :
					V == r ? (g - b) / C :
					V == g ? (b - r) / C + 2 :
					(r - g) / C + 4
				);
				H = ((H + 360) % 6) * 60 / 360;
				S = C === 0 ? 0 : C / V;
				return {
					h: H || 1,
					s: S,
					b: V,
					a: a || 1
				};
			},

			HueToRGB: function(p, q, h) {
				if (h < 0)
					h += 1;
				else if (h > 1)
					h -= 1;

				if ((h * 6) < 1)
					return p + (q - p) * h * 6;
				else if ((h * 2) < 1)
					return q;
				else if ((h * 3) < 2)
					return p + (q - p) * ((2 / 3) - h) * 6;
				else
					return p;
			},

			HSLtoRGB: function(h, s, l, a) {
				if (s < 0) {
					s = 0;
				}
				var q;
				if (l <= 0.5) {
					q = l * (1 + s);
				} else {
					q = l + s - (l * s);
				}

				var p = 2 * l - q;

				var tr = h + (1 / 3);
				var tg = h;
				var tb = h - (1 / 3);

				var r = Math.round(CPGlobal.HueToRGB(p, q, tr) * 255);
				var g = Math.round(CPGlobal.HueToRGB(p, q, tg) * 255);
				var b = Math.round(CPGlobal.HueToRGB(p, q, tb) * 255);
				return [r, g, b, a || 1];
			},

			// a set of RE's that can match strings and generate color tuples.
			// from John Resig color plugin
			// https://github.com/jquery/jquery-color/
			stringParsers: [{
				re: /rgba?\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*(?:,\s*(\d+(?:\.\d+)?)\s*)?\)/,
				parse: function(execResult) {
					return [
						execResult[1],
						execResult[2],
						execResult[3],
						execResult[4]
					];
				}
			}, {
				re: /rgba?\(\s*(\d+(?:\.\d+)?)\%\s*,\s*(\d+(?:\.\d+)?)\%\s*,\s*(\d+(?:\.\d+)?)\%\s*(?:,\s*(\d+(?:\.\d+)?)\s*)?\)/,
				parse: function(execResult) {
					return [
						2.55 * execResult[1],
						2.55 * execResult[2],
						2.55 * execResult[3],
						execResult[4]
					];
				}
			}, {
				re: /#([a-fA-F0-9]{2})([a-fA-F0-9]{2})([a-fA-F0-9]{2})/,
				parse: function(execResult) {
					return [
						parseInt(execResult[1], 16),
						parseInt(execResult[2], 16),
						parseInt(execResult[3], 16)
					];
				}
			}, {
				re: /#([a-fA-F0-9])([a-fA-F0-9])([a-fA-F0-9])/,
				parse: function(execResult) {
					return [
						parseInt(execResult[1] + execResult[1], 16),
						parseInt(execResult[2] + execResult[2], 16),
						parseInt(execResult[3] + execResult[3], 16)
					];
				}
			}, {
				re: /hsla?\(\s*(\d+(?:\.\d+)?)\s*,\s*(\d+(?:\.\d+)?)\%\s*,\s*(\d+(?:\.\d+)?)\%\s*(?:,\s*(\d+(?:\.\d+)?)\s*)?\)/,
				space: 'hsla',
				parse: function(execResult) {
					return [
						execResult[1] / 360,
						execResult[2] / 100,
						execResult[3] / 100,
						execResult[4]
					];
				}
			}],
			template: '<div class="colorpicker dropdown-menu">' +
				'<div class="colorpicker-saturation"><i><b></b></i></div>' +
				'<div class="colorpicker-hue"><i></i></div>' +
				'<div class="colorpicker-alpha"><i></i></div>' +
				'<div class="colorpicker-color"><div /></div>' +
				'</div>'
		};

	}(window.jQuery)

});
